body{
	overflow-x: hidden;
}
.navbar .nav > li > a {
	text-shadow: @navtxtshadow;
}

a.trans07 {
	.opacity(100);
	display: block;
}
a.trans07:hover {
	.opacity(70);
}
.image-bg{background: @imageBg;}
.black05bg{background: transparent url("@{imagePath}/black-bg05.png");background: rgba(0, 0, 0, 0.05) none;}
.black70bg{background: transparent url("@{imagePath}/black-bg70.png");background: rgba(0, 0, 0, 0.7) none;}
.white05bg{background: transparent url("@{imagePath}/white-bg05.png");background: rgba(255, 255, 255, 0.5) none;}
.white03bg{background: transparent url("@{imagePath}/white-bg03.png");background: rgba(255, 255, 255, 0.3) none;}
.content{
	background: @contentBackGround;
}
.content-inner{
	padding: 0px 0 30px 0;
	background: @contentInnerBackGround;
	min-height: 570px;
}
.content-wrapper{
   padding: 15px;	
  .border-radius(5px);
  .white03bg;
   width: 940px;
   margin: auto;
}
.round-shadow{
  .border-radius(4px);
  .box-shadow(0 1px 3px rgba(34, 25, 25, .4));
  overflow: hidden;
  z-index:1;
}
input.placeholder{
	color: @grayLight;
	
}
.slide{
	position:relative;
	overflow: hidden;
	.slideshow{
	  	height: 260px;
		overflow: hidden;
	  	position:relative;
	  	.slide-item{
	  		position:absolute;
	  		top:0px;
	  		left:0px;
			overflow: hidden;
	  		.slide-item-txt{
	  			position:absolute;
	  			top:0px;
	  			left:0px;
	  			padding-left:45px;
	  			padding-top:20px;
	  			height:260px;
	  			color:white;
	  			h3{
					font-size: 50px;
					line-height: 1.6;
					font-weight: normal;
	  			}
	  			p{
					font-size: 14px;
					width: 500px;
					line-height: 1.8;
	  			}
	  		}
	  		
	  	}
	  	.active{
	  		z-index:9;
	  	}
	}
	.prev{
		.hide-text;
	  	position: absolute;
		top: 110px;
		left: 5px;
		.square(40px);
		overflow: hidden;
		z-index: 101;
		background: url("@{imagePath}/arrow-prev.png");
		opacity: .4;
		&:hover{
			.opacity(90);
		}
	  }
	.next{
	  	.hide-text;
	  	position: absolute;
		top: 110px;
		right: 5px;
		.square(40px);
		overflow: hidden;
		z-index: 101;
		background: url("@{imagePath}/arrow-next.png");
		opacity: .4;
		&:hover{
			.opacity(90);
		}
	  }
}
.banner{
	height: 300px;
  	overflow: hidden;
  	.hotshare{
  		border: @border;
  		background-color:white;
		width: 218px;
		height: 298px;
		.item-hd {
			padding: 10px 10px;
			h4 {
				float: left;
				font: bold 18px/25px "Microsoft Yahei";
				color: @grayDark;
			}
		}
		.item-bd {
			padding: 0 10px;
			position: relative;
			ul {
				overflow: hidden;
				margin-left:0px;
				li {
					width: 100%;
					margin-top: -1px;
					padding: 8px 0;
					border-top: @border;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
					a {
						color: @gray;
					}
					a:hover{
						color: @linkColorHover;
					}
				}
			}
		}
  	}
  	.indexslide{
  		.black05bg;
	  	.slideleft{
	  		height: 300px;
	  		width: 590px;
	  		float: left;
	  		position:relative;
	  		.swcont{
		  		position: absolute;
				top: 0;
				left: 0;
				width: 590px;
				height: 300px;
	  		}
	  		
	  		.covertxt{
	  			top: 0;
				left: 0;
				padding: 12px 0 0 20px;
				position:absolute;
				display:block;
				line-height:1.5;
				width: 570px;
				height: 288px;
				font-size: 30px;
	  			font-family: @boldFontFamily;
				font-weight: normal;
				text-shadow: 2px 2px 3px rgba(0, 0, 0, .3);
				color: white;
				cursor: pointer;
	  		}
	  		.coverinfo{
				.black70bg;
	  			position:absolute;
	  			left: 20px;
	  			top:150px;
	  			padding: 12px;
				width: 228px;
				color: white;
				z-index: 500;
				color: white;
				line-height:1.5;
				font-size: @mediumFont;
				.border-radius(5px);
	  		}
	  	}
	  	.slideright{
	  		height: 300px;
	  		width: 110px;
	  		float: left;
	  		position:relative;
	  		img{
	  			float: right;
				padding: 5px;
				cursor: pointer;
				width: 100px;
				height: 50px;
	  		}
	  		div{
		  		position: absolute;
				top: 0;
				left: -10px;
				width: 124px;
				height: 64px;
				z-index: 10;
		  		background: transparent url('@{imagePath}/slide_bg.png') no-repeat;
				_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='@{imagePath}/slide_bg.png',sizingMethod='crop');
				_background: none;
	  		}
	  	}
  	}
}
.home-threads > .home-thread{
	height: 80px;
  	overflow: hidden;
	.image-bg;
  	&:first-child{
		margin-left: 0px;
	}
	.puzzing-img{
		height: 80px;
		img{
			height: 80px;
		}
	}
}

.user-login{
	margin-top: 50px;
}
.login-form{
	border-right:@border;
	padding: 10px;
	.nav-tabs{
		margin-left: 100px;
		margin-right: 40px;
		.active > a, .active > a:hover{
			.black05bg;
		}
	}
}
.login-others{
	margin-left: 40px;
	padding: 10px;
}
.puzz-style{
	.border-radius(3px);
  	.box-shadow(0 1px 2px 0 rgba(0, 0, 0, 0.22));
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#adacac,direction=135,strength=2);
	font-size: @smallFont;
	background-color:white;
}
.nav-search{
	position: absolute;
	right: 2px;
	top: 7px;
	background-color: transparent;
	width: 20px;
	height: 20px;
	border: 0px;
	padding: 2px;
	.opacity(50);
}
.puzzing{
	position: relative;
	.puzzing-txt{
		.opacity(0);
		position: absolute;
		top: 0px;
		left: 0px;
		.size(100%,100%);
		padding:0px;
		font-size: @smallFont;
		color:@gray;
		text-decoration:none;
		background: #fff;
		background: rgba(255, 255, 255, 0.95);
		cursor:pointer;
		z-index:10;
		.btn{
			position: relative;
			margin-right: 5px;
			filter:inherit;
		}
		.actions {
			padding:5px;
			position: relative;
			filter:inherit;
			z-index:5;
			div{
				position: relative;
				filter:inherit;
				.btn{
					margin-right: 0px;
				}
				.dropdown-menu{
					filter:progid:DXImageTransform.Microsoft.Shadow(color=#979797,direction=135,strength=2);
				}
			}
		}
		strong{
			display: inline-block;
			margin: 10px 5px 5px 5px;
			font-size: @mediumFont;
			color: @grayDark;
		}
		span.txt{
			padding: 5px;
			display: block;
			color:@gray;
		}
		em{
			width:100%;
			display: inline-block;
			filter:inherit;
			position:absolute;
			bottom: 10px;
			left: 10px;
			margin: 0 0 3px 0;
			font-weight: bold;
			font-style: normal;
			color:@gray;
		}
	}
}

.home-title{
	padding-top:10px;
}
.home-ads{
	overflow: hidden;
	margin-bottom:20px;
	background-color: @white;
	text-align: center;
}
.home-album{
	overflow: hidden;
	margin-bottom:20px;
	.puzz-style;
	ul{
		list-style: none;
	}
	a{
		color: @grayLight;
	}
	a.btn{
		color:white;
	}
	.album-header{
		margin: 5px 0 0 0;
		text-align: center;
		a{
			color: @gray;
		}
	}
	.album-footer{
		margin: 5px 5px 0 5px;
		text-align: left;
	}
	.image-list{
		clear: both;
		overflow: hidden;
		position: relative;
		li{
			float: left;
			overflow: hidden;
			background: @imageBg;
		}
	}
	.article-list{
		clear: both;
		overflow: hidden;
		position: relative;
		margin-left:0px;
		margin-bottom:0px;
		padding:0px 10px 10px 10px;
		li{
			width: 100%;
			margin-top: -1px;
			padding: 8px 0;
			border-bottom: @border;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			a {
				color: @gray;
			}
		}
	}
	.cell_4{ 
		margin: 0px 8px 0 12px;
		li {
			margin: 5px 5px 0px 0px;
			.square(95px);
			line-height: 95px;
			text-align: center;
		}
	}
	.cell_9,.cell_6{
		margin: 0px 3px 0 7px;
		li {
			margin: 7px 4px 0px 3px;
			.square(62px);
			line-height: 62px;
			text-align: center;
		}
	}
	li.cell_6_1{
		margin: 7px 4px 0px 3px;
		.square(131px);
		line-height: 131px;
		text-align: center;
		img{
			.square(131px);
		}
	}
}
.puzzs {
	list-style: none;
	float: left;
	display:block;
	li{
		float: left;
		position: relative;
	}
	.puzz{
		position: relative;
		clear: left;
		.puzz-style;
		.puzzing-shot{
			padding: 10px;
			.puzzing{
				.size(150px,200px);
				overflow: hidden;
				.puzzing-img{
					.size(150px,200px);
					background:@imageBg;
					display: block;
					overflow: hidden;
				}
			}
			.puzzing-footer{
				margin: 10px 5px 0 5px;
				padding:2px;
				overflow: hidden;
			}
			.follow-prompt {
				margin: 5px 0 0 0;
				float: right;
			}
		}
	}
	.puzz-thumb{
		position: relative;
		.size(66px,88px);
		.puzz-style;
		padding: 6px 6px 13px 6px;
		.puzzing-img{
			float: left;
			.size(66px,88px);
			background:@imageBg;
			display: block;
			overflow: hidden;
		}
		.puzzing-txt{
			line-height:66px;
			text-align:center;
			cursor:pointer;
			strong {
				span {
					padding: 0 0 0 18px;
					font-weight: normal;
					font-size: @mediumFont;
					color: @gray;
					background: url("@{imagePath}/icon-like16.png") no-repeat 0 0;
				}
			}
		}
		div.tooltip-player {
			display: none;
		}
	}
	.badge {
		opacity: 0;
		.transition(opacity 0.2s ease);
	}
	li:hover .badge-pro {
	  opacity: 1;
	}
}
.player-list{
	ol{
		list-style: none;
		float: left;
		li {
			margin: 0;
			padding: 0px 0 8px 5px;
			h5.vcard{
				line-height: 1.4;
				img {
					float: left;
					margin: 0 6px 0 0;
					vertical-align: middle;
					.border-radius(3px);
				}
			}
			span.user-meta {
				display: block;
				margin: 0;
				padding: 0;
				font-size: @smallFont;
				font-weight: normal;
				line-height: 1.2;
				color: @gray;
				i {
					margin: 0 4px;
					text-shadow: 1px 1px 1px white;
					color: @grayLight;
					font-style:normal;
				}
			}
		}
	}
}
.tags{
		padding: 10px 10px;
		overflow: hidden;
		margin-top: 2px;
		ul{
			list-style: none;
			float: left;
			margin:0px;
			li{
				float: left;
				display: block;
				float: left;
				list-style: none;
				a {
					display: inline-block;
					white-space: nowrap;
					margin: 0 5px 10px 0;
					padding: 3px 5px;
					.border-radius(5px);
					font-size:@mediumFont;
					color:@gray;
					border:1px solid lighten(@grayLight, 10%);
					&:hover{
						border-color:@puzzColor;
						color:@puzzColor;
					}
				}
			}
			li.selected{
				a{
					background:@puzzColor;
					border-color:@puzzColor;
					color:white;
				}
			}
		}
	}
.home-category{
	.tags{
		background: white;
		height: 282px;
	}
	.gallery{
		.gallery-198-300{
			.size(300px,198px);
			background: white;
			float:left;
			margin-top: 2px;
			margin-left: 2px;
		}
		.gallery-143-149{
			.size(149px,143px);
			background: white;
			float:left;
			margin-top: 2px;
			margin-left: 2px;
		}
		.gallery-288-149{
			.size(149px,288px);
			background: white;
			float:left;
			margin-left: 2px;
			margin-top: 2px;
		}
		.gallery-188-149{
			.size(149px,188px);
			background: white;
			float:left;
			margin-left: 2px;
			margin-top: 2px;
		}
		.gallery-193-300{
			.size(300px,193px);
			background: white;
			float:left;
			margin-right: 2px;
			margin-top: 2px;
		}
		
	}
}
.home-staruser{
	.star-with-pic{
		float: left;
		.star-info{
			dl{
				position: relative;
				dt{
					float: left;
					width: 60px;
					margin-right: 0px;
					position: relative;
					img {
						display: block;
						vertical-align: top;
						margin-bottom: 5px;
					}
				}
				dd{
					float: left;
					width: 390px;
					.love {
						position: absolute;
						right: 0;
						top: 0;
					}
				}
				p{
					margin:0;
				}
				.desc{
					color:@gray;
				}
			}
		}
	}
	
	.star-without-pic{
		float: left;
		font-size:@smallFont;
		.star-info{
			dl{
				position: relative;
				dt{
					float: left;
					width: 50px;
					margin-right: 10px;
					img {
						display: block;
						vertical-align: top;
						margin-bottom: 5px;
					}
				}
				dd{
					margin-left: 0px;
					.size(55px,160px);
					overflow:hidden;
					float: left;
					line-height: 17px;
				}
				p{
					margin:0;
				}
				.desc{
					color:@gray;
				}
			}
		}
	}
}
.staruser-pic-151-180{
	float:left;
	text-align: center;
	margin: 0 2px 0 0;
	.size(180px,151px);
	background: rgba(255, 255, 255, 0.85);
}
.staruser-pic-304-180{
	float:left;
	text-align: center;
	margin: 0 2px 0 0;
	.size(180px,304px);
	background: rgba(255, 255, 255, 0.85);
}
.footer {
	padding: 20px 0 10px;
	border-top: @border;
	color: @gray;
	font-size: @smallFont;
	a {
		font-weight: bold;
		color: darken(@gray, 5%);
	}
	.desc{
		.text-overflow();
		margin-bottom: 10px;
		p{
			margin:0px;
		}
	}
}
.footer-nav {
	width: 600px;
	margin: 3px 0 3px 0;
	display:inline-block;
	overflow:hidden;
	list-style: none;
	li {
		float: left;
		margin: 0 10px 0 0;
		padding: 0 10px 0 0;
		line-height: 1.3;
		border-right: @border;
		&:last-child {
			margin: 0;
			padding: 0;
			border-right: none;
		}
	}
}
.footer-link {
	.smalltxt;
	clear:both;
	ul {
		list-style: none;
		float: left;
		.smalltxt;
		margin: 0 0 0 10px;
		li {
			float: left;
			margin: 0 5px 0 0;
			padding: 0 5px 0 0;
			a{
				font-weight: normal;
			}
			&:last-child {
				margin: 0;
				padding: 0;
			}
		}
	}
}
.pixels-total{
	position: relative;
	color: @grayLight;
	.counter{
		margin-top: 7px;
		width:230px;
		img{
			margin-left: 3px;
			width: 20px;
			.opacity(40);
		}
		img.null {
			.opacity(10);
		}
		img.dot {
			width: 5px;
		}
	}
}
.nav-category{
	min-width: 210px;
	font-size:@largeFont;
	a{
		font-size:@largeFont;
	}
}
.nav .dropdown-menu a {
	font-size:@largeFont;
}
.nav-drop{
	font-size:@largeFont;
	a{
		font-size:@largeFont;
	}
}
span.tooltip-player-link a {
	color: white;
	font-size: 1.1em;
	font-weight: normal;
}

ul.tools li {
	float: right;
	width: auto;
	margin: 0 0 0 12px;
	display: inline;
	font-size: @smallFont;
	line-height: 1;
	color: @grayLight;
	border-left: none;
	padding-left: 14px;
	cursor: pointer;
	em{
		font-style: normal;
	}
}
ul.tools{
	list-style: none;
	margin-bottom:0px;
	.views {
		padding-left: 18px;
		background: url("@{imagePath}/icon-views-sm.png") no-repeat 0 50%;
	}
	.comments{
		background: url("@{imagePath}/icon-comments.png") no-repeat 0 0;
		&:hover{
			background-position:0 -30px;
		}
	}
	.fav{
		background: url("@{imagePath}/icon-hearts.gif") no-repeat 0 0;
		&:hover{
			background-position:0 -34px;
		}
	}
	.settings{
		margin-left: 0px;
		padding-left: 10px;
		position: relative;
		.dropdown-menu{
			padding: 5px;
			background-color: white;
			width: 150px;
			a{
				clear:none;
				padding: 1px;
				float: left;
			}
		}
	}
	a{
		color: @grayLight;
	}
}
.clip{
	color: @grayLight;
	display:block;
	.size(16px,16px);
	padding-left: 16px;
	float:left;
	background: url("@{imagePath}/icon-clip-16.png") no-repeat 0 0;
}
.love .num {
	color: @puzzColor;
	font-weight: bold;
	font-style: normal;
	background: url("@{imagePath}/icon-hearts.gif") 0 -30px no-repeat;
	padding-left: 15px;
}
h3.special {
	margin: 10px 0 5px 0;
	font-size: @mediumFont;
	font-weight: normal;
	color: #777;
	overflow:hidden;
	span.special-flag {
		padding: 0px 18px 0px 6px;
		font-size: @largeFont;
		font-weight: bold;
		text-transform: uppercase;
		color:white;
		float:left;
		display:inline-block;
		background:@puzzColor url("@{imagePath}/flag-cutout.png") no-repeat 100% 50%;
	}
	span.special-featured{
		background-color: @puzzColor;
	}
	span.special-info{
		background-color: @grayLight;
	}
	a.date-more {
		padding-right: 12px;
		background: url("@{imagePath}/icon-bluearrow.png") no-repeat 100% 6px;
	}
}
.relation-box {
	display: inline-block;
	padding: 2px 2px 2px 2px;
	text-align: center;
	background: lighten(@green,10%) url("@{imagePath}/glass-30.png") repeat-x 0 50%;
	color:white;
	border: 0;
	cursor: pointer;
	font-weight: bold;
	line-height: 17px;
	.border-radius(3px);
	font-size:12px;
	&:hover{
		color:white;
		border-color: lighten(@green,10%);
		background-color: @green;
	}
	.action,&:hover .view {
		.hide;
	}
	.view,&:hover .action {
		.show;
	}
}

#infscr-loading {
	position: fixed;
	bottom: 100px;
	left: 50%;
	width: 120px;
	text-align: center;
	margin-left: -60px;
	z-index: 99;
	background-color: #fafaef;
	border: 1px solid #AAA;
	.border-radius(6px);
	.box-shadow(0 0 18px #999);
	display: block;
	height: 30px;
}

#infscr-loading div {
	display: block;
	float: left;
	margin-top:5px;
	margin-left:5px;
}

#infscr-loading img {
	float: left;
	margin-top:3px;
	margin-left:10px;
	z-index: 2;
}
.tooltip{
	z-index: 1032;
}
.lists{
	margin: 0 0 25px 0;
	list-style:none;
	li {
		margin: 0 0 8px 0;
		padding: 0 0 8px 0;
		font-size: 13px;
		line-height: 1.2;
		border-bottom: @border;
		a{
			display: block;
			overflow: hidden;
			.topic-img{
				background: url("@{imagePath}/topic-frame.png") no-repeat 0 0;
				float: left;
				display: block;
				width: 60px;
				height: 58px;
				margin: 0 8px 0 0;
				padding: 5px;
				img {
					float: left;
					width: 60px;
					height: 45px;
					.transition(opacity 0.2s ease);
				}
			}
			span.list-meta {
				display: block;
				margin: 4px 0 0 0;
				font-size: 11px;
				line-height: 1;
				color: @gray;
			}
		}
	}
	li:last-child {
		margin: 0;
		padding: 0;
		border-bottom: none;
	}
}
.ui-message {
	position: fixed;
	z-index: 102;
	.border-radius(5px);
	.box-shadow(0 0 10px rgba(0, 0, 0, 0.5));
	.bd {
		padding: 10px 10px;
		display: block;
		overflow: hidden;
		position: relative;
		.border-radius(5px);
		text-align: center;
	}
	.ui-close {
		position: absolute;
		z-index: 1;
		top: 0px;
		right: 0px;
		width: 20px;
		height: 20px;
		font-size: 12px;
		line-height: 20px;
		font-weight: bold;
		text-align: center;
		color: @gray;
		&:hover{
			color: @grayDark;
		}
	}
}

li.dropdown:hover ul.dropdown-menu{
    display: block;    
}
a.menu:after, .dropdown-toggle:after {
    content: none;
}
.dropdown-menu {
 	margin-top: 0px;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#adacac,direction=135,strength=2);
}
.message-info {color: #fff;background-color: @btnInfoBackground;}
.message-danger, .message-error {color: #fff;background-color: @btnPuzzBackground;}
.message-success {color: #fff;background-color: @btnSuccessBackground;}
.message-tip {color: #fff;background-color: @orange;}
.message-loading {color: #fff;background-color: @blue;}

.like_add {background: @puzzColor;color: #fff;}
.like_self, .like_already {background: @blue;color: #fff;}
/*add like*/
.like_add,.like_self,.like_already {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 9998;
	width: 120px;
	margin-left: -60px;
	border-radius: 4px;
	font-size: 14px;
	padding: 3px 5px;
	display: block;
	text-align: center;
}
.border-from{
	.black05bg;
	padding-top: 20px;
	padding-bottom: 20px;
	margin-top:50px;
	h2{
		padding-left: 100px;
		margin-bottom: 10px;
	}
}
[class^="pbg-"],
[class*=" pbg-"] {
  position:relative;
  display: inline-block;
  .square(25px);
  .ie7-restore-right-whitespace();
  line-height: 25px;
  vertical-align: text-top;
  background-image: url("@{imagePath}/puzzle_pin.png");
  background-position: 25px 25px;
  background-repeat: no-repeat;
  em{
  	position: absolute;
  	top:-5px;
  	right:-2px;
  	background-color: @puzzColor;
  	color:white;
  	font-size: @smallFont;
  	padding: 2px;
  	display: block;
  	.border-radius(3px);
  	font-style: normal;
  	line-height: 12px;
  }
}
.pbg-puzzle              { background-position: 0      0; }
.pbg-message              { background-position: -25px      0; }
.pbg-bell              { background-position: -50px      0; }

.publish-fetch{
  float:left;
  position:relative;
  display: inline-block;
  .size(30px,100px);
  .ie7-restore-right-whitespace();
  line-height: 30px;
  background-image: url("@{imagePath}/publish-fetch.png");
  background-position: 0px 0px;
  background-repeat: no-repeat;
  &:hover{
  	background-position: 0px -30px;
  }
}

.publish-video{
  float:left;
  position:relative;
  display: inline-block;
  .size(30px,100px);
  .ie7-restore-right-whitespace();
  line-height: 30px;
  background-image: url("@{imagePath}/publish-video.png");
  background-position: 0px 0px;
  background-repeat: no-repeat;
  &:hover{
  	background-position: 0px -30px;
  }
}
.dropdown-menu [class^="pico-"] {
	margin-right: 5px;
	margin-top: 2px;
}
[class^="pico-"],
[class*=" pico-"] {
  display: inline-block;
  .square(15px);
  .ie7-restore-right-whitespace();
  line-height: 15px;
  vertical-align: text-top;
  background-image: url("@{imagePath}/share_icon_14.png");
  background-position: 15px 15px;
  background-repeat: no-repeat;
}
.pico-sina              	{ background-position: 0 -18px; }
.pico-qzone              	{ background-position: -21px -18px; }
.pico-qq              		{ background-position: -43px -18px; }
.pico-renren              	{ background-position: -63px -18px; }
.pico-twitter              	{ background-position: -103px -18px; }
.pico-facebook              { background-position: -122px -18px; }
[class^="lpico-"],
[class*=" lpico-"] {
  display: inline-block;
  .square(24px);
  .ie7-restore-right-whitespace();
  line-height: 24px;
  vertical-align: text-top;
  background-image: url("@{imagePath}/share_icon.png");
  background-position: 24px 24px;
  background-repeat: no-repeat;
}
.lpico-sina              	{ background-position: 0 -23px; }
.lpico-qzone              	{ background-position: -27px -23px; }
.lpico-qq              		{ background-position: -57px -23px; }
.lpico-renren              	{ background-position: -84px -23px; }
.lpico-twitter              	{ background-position: -139px -22px; }
.lpico-facebook              { background-position: -165px -22px; }

[class^="loginico-"],
[class*=" loginico-"] {
  display: inline-block;
  .size(24px,102px);
  .ie7-restore-right-whitespace();
  line-height: 24px;
  vertical-align: text-top;
  background-repeat: no-repeat;
}
.loginico-sina              	{ background-image: url("@{imagePath}/loginbtn_sina.png"); }
.loginico-taobao              	{ background-image: url("@{imagePath}/loginbtn_taobao.png"); }
.loginico-qq              		{ background-image: url("@{imagePath}/loginbtn_qq.png"); }
.loginico-renren              	{ background-image: url("@{imagePath}/loginbtn_renren.png"); }
.loginico-twitter              	{ background-image: url("@{imagePath}/loginbtn_twitter.png"); }
.loginico-facebook              { background-image: url("@{imagePath}/loginbtn_facebook.png"); }

[class^="languageico-"],
[class*=" languageico-"]{
  display: inline-block;
  .size(12px,18px);
  .ie7-restore-right-whitespace();
  line-height: 12px;
  vertical-align: text-top;
  background-repeat: no-repeat;
}
.languageico-zh_cn              { background-image: url("@{imagePath}/zh.gif"); }
.languageico-en              	{ background-image: url("@{imagePath}/en.gif"); }

[class^="headerico-"],
[class*=" headerico-"] {
  display: inline-block;
  .size(16px,16px);
  .ie7-restore-right-whitespace();
  line-height: 16px;
  vertical-align: text-top;
  background-repeat: no-repeat;
}
.headerico-switchstyle{  background-image: url("@{staticImagePath}/style_switch.png");  }
.video_icon{
	.size(54px,54px);
	display:block;
	background: url(@{imagePath}/icon-video.png) no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top:-27px;
	margin-left:-27px;
	z-index: 5;
}
.error{color:red;display: block;}
.error-tip{background-color: @puzzColor;color: white;}
.title-header{font-family: @boldFontFamily;font-weight: normal;}
.site{
	font-family: @boldFontFamily;
	p {
		margin: 5px 0 10px 0;
		line-height: 1.5;
		color: #444;
		&.callout{
			font-size: 15px;
			line-height: 1.5;
		}
	}
		h2.section {
			margin: 0 0 15px 0;
			padding: 0 0 8px 0;
			font-size: 14px;
			line-height: 1;
			background: @borderBack;
			overflow: hidden;
		}
	ul {
		margin: 10px 0 20px 0;
		padding: 0 0 10px 0;
		list-style: none;
		li {
			list-style: none;
			margin: 0 0 20px 0;
			padding: 20px;
			background: white;
			.border-radius(10px);
  			.box-shadow(0 1px 2px rgba(0, 0, 0, 0.07));
  			div.meta {
				float: left;
				width: 120px;
				img.avatar {
					margin: 4px 0 10px 0;
					.border-radius(4px);
				}
			}
			h3 {
				margin: 0 0 4px 140px;
				padding: 0;
				font-size: 18px;
				font-weight: normal;
				a{
					color:@grayDark;
				}
			}
			h4 {
				margin: 0 0 5px 140px;
				font-size: 12px;
				text-transform: uppercase;
				color: @puzzColor;
				font-weight: normal;
			}
			p {
				margin: 0 0 15px 140px;
			}
		}
	}
}
a.footer-twitter {
  margin: 0 15px 0 0;
  padding: 1px 0 0 20px;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-image: url("@{imagePath}/icon-twitter-footer.png");
}
a.footer-weibo {
  margin: 0 15px 0 0;
  padding: 1px 0 0 20px;
  background-repeat: no-repeat;
  background-position: 0 2px;
  background-image: url("@{imagePath}/icon-weibo.png");
}
a.footer-blog {
  margin: 0 15px 0 0;
  padding: 1px 0 0 20px;
  background-repeat: no-repeat;
  background-position: 0 2px;
  background-image: url("@{imagePath}/icon-blog.png");
}
a.footer-facebook {
  margin: 0 15px 0 0;
  padding: 1px 0 0 20px;
  background-repeat: no-repeat;
  background-position: 0 2px;
  background-image: url("@{imagePath}/icon-facebook.png");
}
a.footer-google {
  margin: 0 15px 0 0;
  padding: 1px 0 0 20px;
  background-repeat: no-repeat;
  background-position: 0 2px;
  background-image: url("@{imagePath}/icon-google.png");
}
a.footer-weibo:hover,a.footer-twitter:hover {
	background-position: 0 -34px;
}
a.footer-facebook:hover,a.footer-google:hover {
	background-position: 0 -32px;
}
a.footer-blog:hover {
	background-position: 0 -36px;
}
ul.follow {
  margin: -6px 0 25px 0;
  list-style: none;
  	li a {
	  display: block;
	  padding: 6px 0;
	  font-size: 14px;
	  font-weight: bold;
	  line-height: 28px;
	  color: @gray;
	  border-bottom: @border;
	}
	li:last-child a {
	  border-bottom: none;
	}
	li a:hover {
	  color: @grayDark;
	}
	li a img {
	  float: left;
	  margin: 0 6px 0 0;
	  opacity: .3;
	  -webkit-transition: opacity 0.2s ease;
	  -moz-transition: opacity 0.2s ease;
	  -o-transition: opacity 0.2s ease;
	  transition: opacity 0.2s ease;
	}
	li a:hover img {
	  opacity: .45;
	}
}
div.door {
  float: left;
  width: 340px;
  margin: 0 0 30px 0;
  padding: 30px 40px;
  text-align: center;
  .black05bg;
  .border-radius(10px);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  	h3 {
	  font-size: 22px;
	}
	h4 {
	  margin: 4px 0 15px 0;
	  font-size: 16px;
	  font-weight: normal;
	  color: #777777;
	}
	a.form-sub {
	  display: block;
	  width: 85%;
	  margin: 20px auto 0 auto;
	  padding: 10px 0;
	  font-size: 16px;
	  line-height: 1.5;
	}
}

div.door-last {
  float: right;
}

div.door-full {
  float: none;
  width: auto;
  a.form-sub {
	  width: 50%;
	}
}
#BackToTop{
	z-index: 1000;
	position: fixed;
	right: 9px;
	bottom: 9px;
	width: 40px;
	padding: 10px 10px;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	.opacity(80);
	cursor: pointer;
	.border-radius(8px);
	background: @puzzColor;
	color:white;
	font-weight: bold;
	font-size: @mediumFont;
}
#waterfall {
	min-height: 700px;
}
.affix {
  position: fixed;
}
.pagination{
	height:28px;
	margin:0px;
	a {
		float: left;
		padding: 0 8px;
		line-height: 26px;
		text-decoration: none;
		border: @border;
		margin-left: 2px;
		background-color: @white;
		background-repeat: no-repeat;
		&:hover{
			border-color: @puzzColor;
			color: @puzzColor;
		}
	}
	.active a {
		background-color: @puzzColor;
		color: @white;
		font-weight: bold;
	}
	
}
.alert-center{
	margin-top: 50px;
	width: 220px;
	position: relative;
	left: 50%;
	margin-left: -110px;
}
.navbar .nav li.dropdown .dropdown-toggle .caret,
.navbar .nav li.dropdown.open .caret {
  border-top-color: @navbarLinkColor;
  border-bottom-color: @navbarLinkColorHover;
}

//------------patch20131020-----------------

[class^="smallico-"],
[class*=" smallico-"] {
  display: inline-block;
  .size(16px,16px);
  .ie7-restore-right-whitespace();
  line-height: 16px;
  vertical-align: text-top;
  background-repeat: no-repeat;
}
.smallico-wf              	{ background-image: url("@{imagePath}/icon_wf_all.png"); background-position: 0 0px;}
.smallico-ls              	{ background-image: url("@{imagePath}/icon_ls_all.png"); background-position: 0 0px;}

.active{
	.smallico-wf              	{ background-image: url("@{imagePath}/icon_wf_all.png"); background-position: 0 -16px;}
	.smallico-ls              	{ background-image: url("@{imagePath}/icon_ls_all.png"); background-position: 0 -16px;}
}


.category-ls{
	padding:10px 5px 0px 5px;
	.border-radius(6px);
	.black05bg;
	.category-block{
		padding:5px;
		.border-radius(5px);
		&:hover{
			.white05bg;
			cursor: pointer;
		}
		.category-title{
			font: @mediumFont @boldFontFamily;
			line-height: 14px;
			margin: 6px 0 3px;
		}
		.category-desc{
			font: @smallFont;
			color: @grayLight;
			margin: 6px 0 3px;
		}
	}
}



[class^="iconlove-"],
[class*=" iconlove-"]{
  display: inline-block;
  .size(14px,14px);
  .ie7-restore-right-whitespace();
  line-height: 14px;
  vertical-align: text-top;
  background: url("@{imagePath}/icon-hearts.gif") no-repeat 0 0;
}
.iconlove-red              	{ background-position:0 -34px; }

.actions .meta-liked{
	.btn;
	.icon-heart{
		background: url("@{imagePath}/icon-hearts.gif") no-repeat 0 0;
		background-position:0 -34px;
	}
	
}

